<template>
	<view class="page">
		<!-- 标题栏 start -->
		<fu-custom :isBack="true" bgColor="bg-white" class="header" :isBottom="true">
			<block slot="content">{{ i18n['注销账号'] }}</block>
			<block slot="right">
			</block>
		</fu-custom>
		<view class=" padding-lr">
			<view class="content">
				<scroll-view scroll-y style="height: 80vh;">
					<jyf-parser :html="body"></jyf-parser>
				</scroll-view>
			</view>
		</view>
		<view class="cu-bar foot response padding-bottom bg-white" style="box-shadow: none;">
			<view class="response">
				<view class="agreement padding-top">
					<image class="image" @click="handle_select" v-if="is_select_agree" src="../../static/select.png">
					</image>
					<image class="image" @click="handle_select" v-else src="../../static/noselect.png"></image>
					<view><text>{{ i18n['我已阅读并同意以上协议'] }}</text></view>
				</view>
				<view class="padding-lr">
				<view class="login-btn response" @click="handleNext">
					{{ i18n['下一步'] }}
				</view>
				</view>
			</view>
		</view>
		<!-- 断网监测 start -->
		<fu-notwork></fu-notwork>
		<!-- 断网监测 end -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				body: '',
				is_select_agree: false
			}
		},
		onLoad() {

			this.getData()
		},
		methods: {
			getData() {
				this.$api.post('/v1/5d63befcb25d9',{
					category_id:7
				}).then(res => {
					if (res.data.code == 1) {
						this.body = res.data.data.content
					} else {
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						});
					}
				})
			},
			/**
			 * @param 是否选择同意协议
			 */
			handle_select() {
				this.is_select_agree = !this.is_select_agree
			},
			handleNext() {
				if (!this.is_select_agree) {
					uni.showToast({
						title: this.i18n['请勾选同意协议后操作'],
						icon: 'none'
					});
					return false;
				}

				uni.redirectTo({
					url: '/pages/index/setting/cancel-apply/index'
				})
			}
		},
	}
</script>

<style lang="scss" scoped>
	page {
		height: 100%;
		background: #ffffff;
	}

	.content {
		min-height: 800rpx;
	}

	.agreement {
		display: flex;
		width: 100%;
		font-family: PingFangSC-Regular;
		font-size: 28rpx;
		color: #666666;
		align-items: center;
		justify-content: center;
		margin-bottom: 30rpx;

		.image {
			height: 28rpx;
			width: 28rpx;
			margin-right: 12rpx;
		}

		text {
			color: $theme;
		}
	}

	.login-btn {
		height: 88rpx;
		line-height: 88rpx;
		background: $bgtheme;
		opacity: 1;
		border-radius: 44px;
		font-size: 32rpx;
		color: #FFFFFF;
		font-family: PingFang SC;
		font-weight: 500;
		text-align: center;
	}
</style>
